Code JavaScript tạo biểu đồ đường có điểm ngắt trục
Biểu đồ ScaleAxis Break rất hữu ích để trình bày hai phạm vi riêng biệt trong cùng một biểu đồ. Biểu đồ đường tuyến hỗ trợ ngắt trục trên cả hai trục, giống như các biểu đồ CanvasJS khác. Ví dụ dưới đây là một biểu đồ đường tuyến với tính năng ngắt trục, kèm theo mã JavaScript để bạn có thể chỉnh sửa và chạy trên trình duyệt hoặc lưu về máy.
```javascript
window.onload = function() {
var chart = new CanvasJS.Chart("chartContainer", {
animationEnabled: true,
title: { text: "Lưu lượng truy cập web" },
axisX: { valueFormatString: "DD MMM" },
axisY: { title: "Số khách truy cập", scaleBreaks: { autoCalculate: true } },
data: [{
type: "line",
xValueFormatString: "DD MMM",
color: "#F08080",
dataPoints: [
{ x: new Date(2017, 0, 1), y: 610 },
{ x: new Date(2017, 0, 2), y: 680 },
// ... (các điểm dữ liệu khác)
{ x: new Date(2017, 0, 31), y: 750 }
]
}]
});
chart.render
```html
```
Nguồn: CanvasJS
Bạn có thể tùy chỉnh biểu đồ với các thuộc tính như `type`, `lineThickness`, `startValue`, `endValue`, `Spacing`, và `CollapsibleThreshold`.
Source: https://quantrimang.com/hoc/code-javascript-tao-bieu-do-duong-co-diem-ngat-truc-195021